<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>考拉海购登录</title>
    <link rel="stylesheet" href="./css/public.css">
    <link rel="stylesheet" href="./css/css.css">

</head>

<body>
    <div class="loginTop">
        <div class="main flex-c-between">
            <!-- 这个a标签点击要跳转首页 -->
            <div class="logo1">
                <a href="../index.html"><img src="./images/logo.png" alt="">
                </a>
            </div>
            <!-- <div class="logo2"><img src="./images/logo2.jpg" alt=""></div>  -->
            <div class="logo2">
                <img src="./images/logo2.jpg" alt=""></div>
        </div>
    </div>

    <!-- /////////// -->
    <div class="neirong">
        <div class="tupian">
            <!-- 这个a标签也要跳转首页 -->
            <a href="../index.html"><img src="./images/web_10.jpg" alt=""></a>
        </div>
        <!-- 登录表单 -->
        <div class="zuce">
            <h2>账号登录</h2>
            <input type="text" class="shuru" id="user" placeholder="请输入账号" autocomplete="off" /><br>
            <input type="text" class="shuru" placeholder="请输入密码" id="pass"><br>
            <input type="button" value="登录" id="golog">
            <p>注册/登录代表同意 <a href="https://terms.alicdn.com/legal-agreement/terms/suit_bu1_other/suit_bu1_other202009031501_17558.html" target="_blank"><span class="hong">隐私政策</span></a> 和 <a href="https://terms.alicdn.com/legal-agreement/terms/suit_bu1_other/suit_bu1_other202003231515_29928.html"
                    target="_blank"><span class="hong">服务条款</span></a></p>
            <div class="chan">
                <button>点击创建考拉账号</button>
            </div>
        </div>
        <!-- 注册表单 -->
        <div class="denglu">
            <h2>账号注册</h2>
            <input type="text" class="shuru" id="reg-user" placeholder="请输入账号" autocomplete="off" /><br>
            <input type="text" class="shuru" placeholder="请输入4位以上密码" id="reg-pass"><br>
            <input type="text" class="shuru" id="reg-passtwo" placeholder="请再次输入密码"><br>
            <input type="button" value="注册" id="zc">
            <p>注册/登录代表同意 <a href="https://terms.alicdn.com/legal-agreement/terms/suit_bu1_other/suit_bu1_other202009031501_17558.html" target="_blank"><span class="hong">隐私政策</span></a> 和 <a href="https://terms.alicdn.com/legal-agreement/terms/suit_bu1_other/suit_bu1_other202003231515_29928.html"
                    target="_blank"><span class="hong">服务条款</span></a></p>
            <div>已有拥有账户？<span class="denglus"><a href="" > 登录</a></span></div>
        </div>
    </div>
    <!-- //////////// 底部每个=图片和链接点击都可以跳转-->
    <div class="footer">
        <!-- <div class="f2">
            <p>增值电信业务经营许可证:&nbsp;&nbsp;浙B2-20160288&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; （浙）网械平台备字[2018]第00007号&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 阿里巴巴版权所有©2003-2022&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="https://you.kaola.com/common/page.html?spm=a2v0d.b64726952.0.0.34b74f51wsDkZC&key=Privacy_policy"
                    target="_blank">隐私政策</a> - <a href="https://www.kaola.com/?spm=a2v0d.b64726952.0.0.34b74f51wsDkZC&zn=footer" target="_blank">考拉海购</a></p>
            <p>网络文化经营许可证:&nbsp;&nbsp;浙网文&nbsp;&nbsp;(2020)&nbsp;&nbsp;4340-180号 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;浙江省网络食品销售第三方平台提供者备案:&nbsp;&nbsp;浙网食A33010006 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="https://kaola-haitao.oss.kaolacdn.com/6df8bb71-a013-41d4-8491-548215da176d.png"
                    target="_blank">网络第三方平台规范进口冷链食品承诺函</a></p>
            <p>
                <a href="http://www.beian.gov.cn/portal/registerSystemInfo?spm=a2v0d.b64726952.0.0.34b74f51wsDkZC&recordcode=33010802002216&no_protofix" target="_blank"><img src="./image/公安.jpg" alt=""></a><a href="http://www.beian.gov.cn/portal/registerSystemInfo?spm=a2v0d.b64726952.0.0.34b74f51wsDkZC&recordcode=33010802002216&no_protofix" target="_blank">浙公网安备 33010802002216号</a> 互联网药品信息服务资格证书编号（浙）-
                经营性 - 2017 - 0027 <a href="https://beian.miit.gov.cn/?spm=a2v0d.b64726952.0.0.34b74f51wsDkZC#/Integrated/index" target="_blank">浙ICP备16011229号-6</a> <a href="https://pages.kaola.com/pages/activity/Businessentity.shtml?spm=a2v0d.b64726952.0.0.34b74f51wsDkZC"
                    target="_blank">自营经营者信息</a>
            </p>
            <div>
                <a href="https://ss.knet.cn/verifyseal.dll?spm=a2v0d.b64726952.0.0.dde94f51dW0j15&sn=e15040881010058239iy2f000000&ct=df&a=1&pa=20160215" target="_blank"><img src="./image/图片底部1.jpg" alt=""></a>
                <a href="https://www.12377.cn/?spm=a2v0d.b64726952.0.0.dde94f51dW0j15" target="_blank"><img src="./image/文件底部2.jpg" alt=""></a>
                <a href="https://www.12377.cn/?spm=a2v0d.b64726952.0.0.dde94f517MrCdB" target="_blank"><img src="./image/网页底部_05.jpg" alt=""></a>
                <a href="http://www.zjjubao.com/?spm=a2v0d.b64726952.0.0.dde94f51Qlvvbh" target="_blank"><img src="./image/网页底部_06.jpg" alt=""></a>
                <a href="https://jbts.mct.gov.cn/?spm=a2v0d.b64726952.0.0.dde94f5187Reme" target="_blank"><img src="./image/网页底部_07.jpg" alt=""></a>
                <a href="https://www.shdf.gov.cn/?spm=a2v0d.b64726952.0.0.dde94f516QMbpd" target="_blank"><img src="./image/网页底部_08.jpg" alt=""></a>
                <a href="https://www.12315.cn/?spm=a2v0d.b64726952.0.0.dde94f518kVGSq" target="_blank"><img src="./image/网页底部_09.jpg" alt="">
                </a>
            </div>
        </div> -->
    </div>
</body>
<script src="./libs/jquery.js"></script>
<script>
    $(".footer").load(`/public/publicPage.html #footer`);

    function registerTab() {
        // $("#user").val("");
        // $("#pass").val("");
        $(".zuce").hide()
        $(".denglu").show()
    }

    function loginTab() {
        // $("#reg-user").val("");
        // $("#reg-pass").val("");
        // $("#reg-passtwo").val("");
        $(".zuce").show()
        $(".denglu").hide()
    }
    // 设置默认项：
    loginTab()
        // 点击切换注册
    $(".chan").click(function() {
            // console.log(this)
            registerTab()
                // return false
        })
        // 点击切换登录
    $(".denglus").click(function() {
        // console.log(this)
        loginTab()
            // return false
    })

    // 点击注册开始注册功能
    $("#zc").click(function() {
        // 注册重复密码验证
        const reg = /^[\da-zA-Z-_]{4,20}$/
            // 如果通过正则，开启ajax
        if (reg.test($("#reg-pass").val()) && $("#reg-pass").val() == $("#reg-passtwo").val()) {
            // console.log(1)
            $.ajax({
                url: "http://localhost:3000/api",
                data: {
                    type: "register",
                    username: $("#reg-user").val(),
                    password: $("#reg-pass").val()
                },
                success: res => {
                    res = JSON.parse(res);
                    if (res.code == 101) {
                        if (confirm("注册成功,go Login?")) {
                            loginTab()
                        } else {
                            $("#reg-user").val("");
                            $("#reg-pass").val("")
                            $("#reg-passtwo").val("")
                        }
                    } else {
                        alert("注册失败，" + res.title);
                        $("#reg-user").val("");
                        $("#reg-user")[0].focus();
                    }
                }
            })
        } else {
            alert("两次密码不一致")
            $("#reg-passtwo").val("")
            $("#reg-passtwo")[0].focus();
        }
        return false
    })

    // 登录功能
    $("#golog").click(function() {
        $.ajax({
            url: "http://localhost:3000/api",
            data: {
                type: "login",
                username: $("#user").val(),
                password: $("#pass").val()
            },
            success: res => {
                res = JSON.parse(res);
                console.log(res)
                    // 登录成功
                    // console.log(res)
                if (res.code === 1) {
                    // 登录成功的状态存到本地
                    localStorage.setItem("key", "ok");
                    localStorage.setItem("username", res.data.username);
                    if (confirm("登录成功，是否跳转到首页")) {
                        location.assign("http://localhost:3000/index.html")
                    }
                } else if (res.code === 2) {
                    alert(res.title);
                    $("#pass").val("")
                    $("#pass")[0].focus();
                } else if (res.code === 3) {
                    if (confirm(res.title + "是否去注册")) {
                        registerTab();
                    }
                }
            }
        })
        return false
    })
</script>

</html>